<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:v-model="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <!--/*@thymesVar id="title" type="templates"*/-->
    <title th:text="${title}">默认的标题</title>
    <link rel="stylesheet" th:href="@{/static/layui/js/css/layui.css}">
    <script th:src="@{/static/layui/js/layui.js}" charset="UTF-8" type="text/javascript"></script>
    <script th:src="@{/static/vue/vue.js}" charset="UTF-8" type="text/javascript"></script>
    <script th:src="@{/static/vue/axios.min.js}" charset="UTF-8" type="text/javascript"></script>
    <script th:src="@{/static/jquery/jquery.js}" charset="UTF-8" type="text/javascript"></script>
    <style>
        .layui-bold{
            font-weight: bold;
        }
    </style>
</head>
<body>
<div class="layui-layout layui-layout-admin">

    <ul class="layui-nav layui-header" lay-bar="disabled" >
        <li class="layui-nav-item layui-nav-itemed ">
            <span>
                <span class="layui-font-20" >
                    访客信息管理平台
                </span>
                <span class="layui-hide-xs"></span>

            </span>

        </li>
        <li class="layui-nav-item layui-layout-right " style="margin-right: 80px">
           <span class="layui-circle layui-badge-rim " >
                <i class="layui-icon layui-icon-username " style="margin-right: 13px"></i>
                 <span class="layui-badge-dot layui-bg-green" style="margin-left: -12px"></span>
            </span>

            <span th:inline="text">管理员ID：[[${stp.getLoginId()}]]</span>



            <dl class="layui-nav-child"> <!-- 二级菜单 -->
                <dd>
                    <a th:href="@{/admin/logout}">
                        <i class=" layui-icon layui-icon-logout"></i>
                        退出登录
                    </a>
                </dd>
            </dl>
        </li>

    </ul>
    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree" lay-filter="test">
                <li class="layui-nav-item ">
                    <a class="layui-icon layui-icon-auz" th:href="@{/admin/index/authorize}">授权管理</a>

                </li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="layui-icon layui-icon-console" th:href="@{/admin/index/supervision}">访问监管</a>
                </li>
                <li class="layui-nav-item">
                    <a class="layui-icon layui-icon-set-fill" th:href="@{/admin/index/mng}">管理员信息管理</a>
                </li>

            </ul>
        </div>
    </div>


<!--右侧业务界面-->
    <div class="layui-body" >
        <div  class="layui-nav layui-bg-green">
            <ul  >
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="layui-icon layui-icon-log"  th:href="@{/admin/index/supervision/log}">请求与访问记录</a>

                </li>
                <li class="layui-nav-item ">
                    <a class="layui-icon layui-icon-log layui-icon-password"  th:href="@{/admin/index/supervision/control}">访问控制</a>

                </li>

                <li class="layui-nav-item">
                    <a class="layui-icon layui-icon-website" th:href="@{/admin/index/supervision/float}">流量监控</a>
                </li>
            </ul>
        </div>
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">请求记录</li>
                <li>访问记录</li>
            </ul>

            <div class="layui-tab-content">
                <!--卡片1-访问记录-->
                <div class="layui-tab-item layui-show">
                    <div class="layui-form"  id="selectRequestSubmit">

                        <div class="layui-form-item">
                            <div class="layui-btn-group layui-inline" style="margin-top: 10px; margin-left: 10px" >
                                <button
                                        class="layui-font-14 layui-bold layui-btn layui-btn-normal layui-btn-danger"
                                        @click="deleteClickRequest"
                                >
                                    <i class="layui-icon">&#xe640;</i>
                                </button>

                                <button
                                        class="layui-font-14 layui-bold layui-btn  "
                                        id="flushButtonRequest"
                                >
                                    <i class="layui-icon">&#xe669;</i>
                                </button>


                                <button
                                        class="layui-font-14 layui-bold layui-btn  "
                                        @click="selectClickRequest"
                                >
                                    <i class="layui-icon">&#xe615;</i>
                                </button>



                            </div>

                            <div class="layui-inline" style="margin-top: 10px; margin-left: 20px">
                               <a>访问IP</a>
                            </div>
                            <div class="layui-inline" style="margin-top: 10px;">
                                <input type="text"
                                       v-model:value="message"
                                       required
                                       lay-verify="required"
                                       placeholder="请输入访问IP"
                                       autocomplete="off"
                                       class="layui-input"
                                       style="width: 200px"

                                />
                            </div>

                            <div class="layui-inline" style="margin-top: 10px;">
                                <label class="layui-form-label" >日期范围</label>
                                <div class="layui-inline" id="dateRangeRequest">
                                    <div class="layui-input-inline">
                                        <input type="text" autocomplete="off" id="requestStartDate" class="layui-input" placeholder="开始日期">
                                    </div>
                                    <div class="layui-form-mid">-</div>
                                    <div class="layui-input-inline">
                                        <input type="text" autocomplete="off" id="requestEndDate" class="layui-input" placeholder="结束日期">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!--数据表-->
                    <div >
                        <table class="layui-table"  id="dataTableRequest" style="margin-top: -10px;" lay-size="sm" lay-filter="dataTableRequest"></table>
                    </div>
                </div>

                <!---卡片访问记录-->
                <div class="layui-tab-item">
                    <div class="layui-form"  id="selectSubmit">

                        <div class="layui-form-item">
                            <div class="layui-btn-group layui-inline" style="margin-top: 10px; margin-left: 10px" >
                                <button
                                        class="layui-font-14 layui-bold layui-btn layui-btn-normal layui-btn-danger"
                                        @click="deleteClick"
                                >
                                    <i class="layui-icon">&#xe640;</i>
                                </button>

                                <button
                                        class="layui-font-14 layui-bold layui-btn  "
                                        id="flushButton"
                                >
                                    <i class="layui-icon">&#xe669;</i>
                                </button>


                                <button
                                        class="layui-font-14 layui-bold layui-btn  "
                                        @click="selectClick"
                                >
                                    <i class="layui-icon">&#xe615;</i>
                                </button>



                            </div>

                            <div class="layui-inline" style="margin-top: 10px;">
                                <input type="radio"
                                       value="byIP"
                                       name="userChoice"
                                       title="访问IP"

                                >

                                <input type="radio"
                                       name="userChoice"
                                       value="byId"
                                       title="用户id"
                                       checked
                                >
                            </div>
                            <div class="layui-inline" style="margin-top: 10px;">
                                <input type="text"
                                       v-model:value="message"
                                       required
                                       lay-verify="required"
                                       placeholder="请输入有关信息"
                                       autocomplete="off"
                                       class="layui-input"
                                       style="width: 200px"

                                />
                            </div>

                            <div class="layui-inline" style="margin-top: 10px;">
                                <label class="layui-form-label" >日期范围</label>
                                <div class="layui-inline" id="dateRange">
                                    <div class="layui-input-inline">
                                        <input type="text" autocomplete="off" id="startDate" class="layui-input" placeholder="开始日期">
                                    </div>
                                    <div class="layui-form-mid">-</div>
                                    <div class="layui-input-inline">
                                        <input type="text" autocomplete="off" id="endDate" class="layui-input" placeholder="结束日期">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!--数据表-->
                    <div >
                        <table class="layui-table"  id="dataTable" style="margin-top: -10px;" lay-size="sm" lay-filter="dataTable"></table>
                    </div>
                </div>

        </div>


        </div>




    </div>





</div>






<!--表单提交-->
<!--访问记录-->
<!--表格数据源--> <!--restful风格 ： /index/supervision/log/visitors 方法：get-->
<form th:action="@{/admin/index/supervision/log/visitors}" id="dataSource"></form>

<!--查找-->       <!--restful风格 ：/index/supervision/log/visitors/byId(byName)/id号(IP地址)/开始日期/终止日期 方法：get-->
<form th:action="@{/admin/index/supervision/log/visitors/}" id="selectVisitor"  method="get"></form>

<!--删除-->       <!--restful风格 ： /index/visitors 方法：delete-->
<form th:action="@{/admin/index/supervision/log/visitors}" id="deleteVisitor" method="post"></form>


<!--请求记录-->

<!--表格数据源--> <!--restful风格 ： /index/supervision/log/request 方法：get-->
<form th:action="@{/admin/index/supervision/log/request}" id="dataSourceRequest"></form>

<!--查找-->       <!--restful风格 ： 有日期：/index/supervision/log/request/id号(IP地址)/开始日期/终止日期 方法：get-->
<!-- 无日期：/index/supervision/log/request/id号-->
<!-- 纯日期限制：/index/supervision/log/request/开始日期/终止日期 -->
<form th:action="@{/admin/index/supervision/log/request/}" id="selectRequest"  method="get"></form>

<!--删除-->       <!--restful风格 ： /index/supervision/log/request 方法：delete-->
<form th:action="@{/admin/index/supervision/log/request}" id="deleteRequest" method="post"></form>















<!--引入外部脚本文件-->
<script type="text/javascript" th:src="@{/static/pageStrape2_1.js}"></script>

</body>


</html>